<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/jquery-3.5.1.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<!--href="javascript:"
			表示该超链接不发生任何跳转
			上面的情况一般是配合事件来实现其它功能
		  -->
		<a href="#" download="../js/jquery-3.5.1.js">下载jquery</a>
		<a id="a1" href="javascript:">不会发生跳转的超链接</a>
		<a id="a2" href="../0817/02-Jq实现Checkbox全选.html">去到0817/02-Jq实现Checkbox全选.html</a>
		在后台开发，不重页面，只重数据
			数据一般只有几种操作
				数据如何保存
					下载到txt、json等文件
					浏览器中
						sessionStorage
						localStorage
						cookies
					数据库中
					内存中
						数组
						集合：JS只有ES6才支持
						对象：
				数据如何显示
					将数组中的数据显示在table标签中
						JS实现
						JQ实现
						JQ的datatable插件
					将数据库中的数据保存在数组中，然后将该数组中的数据显示在table上
				数据如何传递
					html中的JS实现
						sessionStorage
						localStorage
						cookies
					后台实现
				<a id="a3" href="#" download="data.json">下载</a>
				<!-- download是指下载的文件名，href为下载文件路径 -->
				<button type="button">下载</button>
				<a href="../img/a.png" download="下载的图片.png">下载a.png</a>
		<script type="text/javascript">
			$("#a1").click(function() {
				console.log(1);
			});
			$("#a2").click(function() {
				console.log(2);
			});
			//2、添加一个下载按钮，点击实现将表格中的数据下载到本地，且文件名为data.json。
			let books = [
				{id: 1, name: 'Java从入门到放弃', price: 80, tdate: '2020-07-01', count: 1, account: "hehe"},
				{id: 2, name: 'Vue从入门到放弃', price: 90, tdate: '2020-07-02', count: 1, account: "haha"},
				{id: 3, name: 'Mysql从入门到放弃', price: 100.01, tdate: '2020-07-03', count: 1, account: "hehe"},
				{id: 4, name: '啥都从入门到放弃', price: 70.00, tdate: '2020-07-04', count: 1, account: "haha"},
			];
			
			$("#a3").click(function() {
				console.log(3);
				
			});
			
		</script>
	</body>
</html>
